@font-face {
    font-family: 'upright-bak';
    src: url('../font/font.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


.wrapper,body {
    font-family: upright , 'Microsoft YaHei', arial, sans-serif;
    position: relative;
    min-width: 320px;
    max-width: 750px;
    margin: 0 auto;
    overflow: hidden;
}
*{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
body{
    position: relative;
}
#loading{
    position: fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: #3bc6bf url("../images/page-4.jpg?v=201609010") center bottom no-repeat;
    -webkit-background-size:100% auto;
    background-size:100% auto;
    z-index: 9999;
}
#loading:before,
.question:before{
    content: '';
    position: absolute;
    top:-0.05rem;
    left:0;
    width:100%;
    height:100%;
    background: #3bc6bf url("../images/page-4.jpg?v=201609010") center bottom no-repeat;
    animation: wave 1.8s linear infinite alternate both;
    z-index: -1;
}

#loading .logo{
    position: absolute;
    top:2.3rem;
    left:50%;
    margin-left:-1.94rem;
    width:3.88rem;
    height:0.59rem;
    background:url(../images/logo.png) center center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
#loading .bar{
    width:4.2rem;
    height:0.55rem;
    position: absolute;
    top:5rem;
    left:1.8rem;
    text-align: center;
    color:#c8a063;
    font-weight:bold;
    z-index:100;
}
.bar-progress{
    position: absolute;
    top:0;
    left:0;
    width:0%;
    height:0.06rem;
    background:#c8a063;
    z-index: 10;
    border-radius:0.05rem;
    transition: all 0.4s;
}
.bar-progress-gb{
    position: absolute;
    top:0;
    left:0;
    width:4.2rem;
    height:0.06rem;
    background:#fff;
    border-radius:0.05rem;
}
#loading .bar .percent{
    font-size:0.28rem;
    line-height: 0.5rem;
}
.page {
    position: relative;
    padding-top: 1px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
}
.page-1{
    background: url("../images/page-1.jpg?v=201609010") center bottom  no-repeat;
    -webkit-background-size:100% auto;
    background-size:100% auto;
}
.page-1:before{
    content: '';
    position: absolute;
    top:-0.05rem;
    left:0;
    width:100%;
    height:7rem;
    background: #3bc6bf url("../images/page-1-ani.jpg?v=201609010") center top no-repeat;
    animation: wave 1.8s linear infinite alternate both;
    z-index: -1;
}
.page-2{
    background: url("../images/page-2.jpg?v=201609010") center bottom  no-repeat;
    -webkit-background-size:100% auto;
    background-size:100% auto;
}

.page-3{
    background: url("../images/page-3.jpg?v=201609010") center bottom  no-repeat;
    -webkit-background-size:100% auto;
    background-size:100% auto;
}

.page-5{
    background: url("../images/page-3.jpg?v=201609010") center bottom  no-repeat;
    -webkit-background-size:100% auto;
    background-size:100% auto;
}
.page-5:before{
    content: '';
    position: absolute;
    top:-0.05rem;
    left:0;
    width:100%;
    height:100%;
    background: #3bc6bf url("../images/page-3.jpg?v=201609010") center bottom no-repeat;
    animation: wave 1.8s linear infinite alternate both;
    z-index: -1;
}

.page-6{
    background: url("../images/page-6.jpg?v=201609010") center bottom  no-repeat;
    -webkit-background-size:100% auto;
    background-size:100% auto;
}

.logo{
    position: absolute;
    top:0.5rem;
    left:50%;
    margin-left:-1.94rem;
    width:3.88rem;
    height:0.59rem;
    background: url("../images/logo.png?v=201609010") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.slogan-1{
    position: absolute;
    top: 0.8rem;
    left: 1.2rem;
    width:5.3rem;
    height:6.12rem;
    background: url("../images/slogan-1.png?v=201609025") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-1 ._2017{
    position: absolute;
    top: 5.6rem;
    left: 1.5rem;
    width:1rem;
    height:3.76rem;
    background: url("../images/2017.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}

.page-2 .title{
    position: relative;
    padding-top:0.8rem;
    color: #c8a063;
    font-size:0.54rem;
    text-align: center;
    z-index: 2;
}
.page-2 .title .title-1{
    margin:0 auto;
    height:1.1rem;
    width:4.94rem;
    line-height:1.2rem;
    background: #c9a44b;
    color: #ffffff;
    font-size:0.8rem;
    border-radius: 1rem;
}
.page-2 .title .title-2{
    margin-top:0.3rem;
    text-shadow: 2px 0px 0px #fff,-2px 0px 0px #fff,0px 2px 0px #fff,0px -2px 0px #fff;
    font-size:0.6rem;
}
.page-2 .title p{
    font-family: upright;
    font-weight:bold;
    line-height:0.6rem;
}
.slogan-2{
    position: absolute;
    top:2.8rem;
    left:1.47rem;
    width:4.73rem;
    height:2.18rem;
    background: url("../images/slogan-2.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-2 .type{
    position: relative;
    margin:0 auto;
    margin-top:0.8rem;
    margin-bottom:0.6rem;
    width:5rem;
    height:5.75rem;
    background: url("../images/type.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-2 .type li{
    position: absolute;
    width:1.77rem;
    height:1.77rem;
}
.page-2 .type li:nth-child(1) {
    top: -0.5rem;
    right: 1.6rem;
    background: url("../images/jobs-1.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-2 .type li:nth-child(2) {
    top: 0.6rem;
    right: -0.6rem;
    background: url("../images/jobs-2.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-2 .type li:nth-child(3) {
    bottom: 1.1rem;
    right: -0.6rem;
    background: url("../images/jobs-3.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-2 .type li:nth-child(4) {
    bottom: -0.3rem;
    right: 1.6rem;
    background: url("../images/jobs-4.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-2 .type li:nth-child(5) {
    bottom: 1.1rem;
    left: -0.6rem;
    background: url("../images/jobs-5.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-2 .type li:nth-child(6) {
    top: 0.6rem;
    left: -0.6rem;
    background: url("../images/jobs-6.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}

.page-2 .tips-1{
    margin-top:0.2rem;
    color: #b60005;
    text-align: center;
    font-size:0.4rem;
    font-weight:bold;
    text-shadow: 2px 0px 0px #fff,-2px 0px 0px #fff,0px 2px 0px #fff,0px -2px 0px #fff;
}
.page-2 .tips-2{
    margin-top:0.4rem;
    color: #b60005;
    text-align: center;
    font-size:0.28rem;
    font-weight:bold;
    text-shadow: 2px 0px 0px #fff,-2px 0px 0px #fff,0px 2px 0px #fff,0px -2px 0px #fff;
}
.page-3 .map{
    position: absolute;
    margin:0 auto;
    margin-top:0.2rem;
    width:7.03rem;
    height:7.94rem;
    background:url("../images/map.png?v=201609012") center center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
    z-index:10;
}
.page-3 .map-place{
    margin:0 auto;
    margin-top:0.2rem;
    width:7.03rem;
    height:5.88rem;
}
.page-3 .times ul{
    max-width: 6rem;
    padding-top:0.1rem;
    color:#fff;
    font-size:0.3rem;
    font-weight:bold;
    overflow: hidden;
}
.page-3 .times ul li{
    float:left;
    margin-bottom:0.2rem;
    padding: 0 0.5rem;
    height:0.55rem;
    line-height:0.55rem;
    border-top-right-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}
.page-3 .times ul li:nth-child(1){
    background: #67a8cd;
}
.page-3 .times ul li:nth-child(2){
    background: #67a8cd;
}
.page-3 .times ul li:nth-child(3){
    background: #67a8cd;
}
.page-3 .times ul li:nth-child(4){
    background: #67a8cd;
}
.page-3 .times ul li:nth-child(5){
    background: #67a8cd;
}
.page-3 .flag {
    padding-left:0.4rem;
    width:5.3rem;
    height:0.9rem;
    background: url("../images/flag.png?v=201609010") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-3 .tips {
    padding-left:0.3rem;
    font-size:0.3rem;
    color: #c9a44b;
    text-shadow: 2px 0px 0px #fff,-2px 0px 0px #fff,0px 2px 0px #fff,0px -2px 0px #fff;
}
.page-3 .process{
    position: relative;
    width:6.87rem;
    height:5.55rem;
}
.page-3 .process .sub{
    position: absolute;
    width:1.4rem;
    height:1.4rem;
    line-height:1.4rem;
    -webkit-background-size:contain;
    background-size:contain;
    font-size:0.4rem;
    text-align: center;
    color: #fff;
    border-radius: 100%;
}
.page-3 .process .sub span{
    position: absolute;
    width:0.85rem;
    height:0.25rem;
    background: url("../images/arrows.png?v=201609010") right center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}

.page-3 .process .sub.sub-1 {
    bottom: 0.2rem;
    left:1.9rem;
    background: url("../images/process-1.png?v=201609010") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-3 .process .sub.sub-1 span{
    left: -0.95rem;
    top: 0;
    transform:rotate(30deg);
}
.page-3 .process .sub.sub-2 {
    bottom: 1.44rem;
    left:0.15rem;
    background: url("../images/process-2.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-3 .process .sub.sub-2 span{
    left: 0rem;
    top: -0.7rem;
    transform:rotate(80deg);
}

.page-3 .process .sub.sub-3 {
    bottom: 3.36rem;
    left:0rem;
    background: url("../images/process-3.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-3 .process .sub.sub-3 span{
    left: 1.3rem;
    top: -0.1rem;
    transform: rotate(150deg);
}

.page-3 .process .sub.sub-4 {
     bottom: 4.21rem;
     left:1.66rem;
    background: url("../images/process-4.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
 }
.page-3 .process .sub.sub-4 span{
    left: 1.5rem;
    top: 0.8rem;
    transform: rotate(200deg);
}
.page-3 .process .sub.sub-5 {
    bottom: 3.9rem;
    left: 3.55rem;
    background: url("../images/process-5.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-3 .process .sub.sub-5 span{
    left: 1.5rem;
    top: 0.4rem;
    transform: rotate(170deg);
}
.page-3 .process .sub.sub-6 {
    bottom: 4.08rem;
    left: 5.43rem;
    animation-duration: 3s;
    background: url("../images/process-6.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}

@keyframes  arrows{
    from{
        background-position-x: 0.95rem ;
    }
    to{
        background-position-x: -0.75rem ;
    }
}

.page-5 .content .tester {
    position: absolute;
    top:2.8rem;
    left:2rem;
    width:2.2rem;
    height:1rem;
}

.page-5 .link-box{
    position: relative;
    margin:0 auto;
    margin-top:0.4rem;
    width:6rem;
    height:6.1rem;
    background: url("../images/bg-4.png?v=201609010")  center no-repeat;
    -webkit-background-size:2.86rem 2.86rem;
    background-size:3.8rem 3.8rem;
}
.page-5 .link-box .phone {
    display: block;
    position: absolute;
    top: 1.9rem;
    left: 2.3rem;
    width:1.5rem;
    height:3.35rem;
    background: url("../images/phone.png?v=201609010")  center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-5 .link-box a{
    position: relative;
    top:0;
    left:0px;
    display: block;
    width:5rem;
    height: 5.8rem;
    z-index: 20;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
.page-5 .link-box .phone .hand {
    position: absolute;
    top: 1.1rem;
    left: 0.7rem;
    width:0.8rem;
    height:0.828rem;
    background: url("../images/hand.png")  center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
    z-index: 10;
    animation: hand 3s linear infinite 0.5s both;
}
.page-5 .link-box .phone .cirZoom {
    position: absolute;
    top: 0.6rem;
    left: 0.5rem;
    background: #2d6c81;
    opacity: 0.5;
    width:1rem;
    height:1rem;
    border-radius: 100%;
    animation: cirZoom 3s linear infinite 0s both;
}
.page-5 .link-box .link{
    position: absolute;
    top:0rem;
    left:0rem;
    width:6rem;
    height:6.1rem;
    background: url("../images/link.png?v=201609010") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
@keyframes link {
    from{
        transform: rotate(0deg);
    }
    10%{
        transform: rotate(120deg);
    }
    50%{
        transform: rotate(120deg);
    }
    60%{
        transform: rotate(270deg);
    }
    90%{
        transform: rotate(270deg);
    }
    to{
        transform: rotate(360deg);
    }

}
.page-5 .link-box li:nth-child(1){
    position: absolute;
    left: 0.5rem;
    top: 0.18rem;
    width: 0.85rem;
    height: 0.85rem;
    background: url("../images/msg-1.png?v=201609010") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-5 .link-box li:nth-child(2){
    position: absolute;
    left: 0.7rem;
    bottom: -0.13rem;
    width: 0.85rem;
    height: 0.85rem;
    background: url("../images/msg-2.png?v=201609010") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-5 .link-box li:nth-child(3){
    position: absolute;
    right: 0.5rem;
    top: 0.18rem;
    width: 0.85rem;
    height: 0.85rem;
    background: url("../images/msg-3.png?v=201609010") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}

.page-5 .way{
    margin:0 auto;
    margin-top:0.7rem;
    width:5.7rem;
    height:4.22rem;
    background: url("../images/way.png") center top no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
@keyframes hand {
    from{
        opacity: 0;
        transform: translate3d(1rem,-2rem,0);
    }
    30%{
        opacity: 0;
        transform: translate3d(1rem,-2rem,0);
    }
    40%{
        opacity: 1;
    }
    50%{
        transform: translate3d(0rem,0rem,0) scale(0.9);
    }
    55%{
        transform: translate3d(0rem,0rem,0) scale(1);
    }
    60%{
        transform: translate3d(0rem,0rem,0) scale(0.9);
    }
    65%{
        transform: translate3d(0rem,0rem,0) scale(1);
    }
    70%{
        transform: translate3d(0rem,0rem,0) scale(0.9);
    }
    75%{
        transform: translate3d(0rem,0rem,0) scale(1);

    }
    90%{
        opacity: 1;
    }
    to{
        transform: translate3d(0rem,0rem,0) scale(1);
        opacity: 0;
    }
}
@keyframes cirZoom {
    0% {
        opacity: 0;
        transform: scale(1, 1)
    }
    70%{
        opacity: 0;
        transform: scale(1, 1)
    }
    90% {
        opacity: 0.5;
        transform: scale(1.3, 1.3)
    }
    100% {
        opacity: 0;
        transform: scale(1.5, 1.5)
    }
}

@-webkit-keyframes cirZoom {
    0% {
        opacity: 0;
        -webkit-transform: scale(1, 1)
    }
    70%{
        opacity: 0;
        -webkit-transform: scale(1, 1)
    }
    90% {
        opacity: 0.5;
        -webkit-transform: scale(1.3, 1.3)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1.5, 1.5)
    }
}

.page-6 .slogan-6{
    position: absolute;
    top:0.8rem;
    left:0.9rem;
    width:5.53rem;
    height:4.1rem;
    background: url("../images/slogan-6.png?v=123") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.page-6 ._2code{
    position: absolute;
    top:5rem;
    left: 50%;
    margin-left:-1.5rem;
    width:3rem;
}
.page-6 ._2code img{
    display: block;
    width:100%;
}
.page-6 p{
    position: absolute;
    top:8.2rem;
    left:0px;
    width:100%;
    text-align: center;
    color: #c9a44b;
    font-size:0.42rem;
}
.question {
    position: absolute;
    top:0px;
    left:0px;
    width:100%;
    background: url("../images/page-4.jpg") center bottom no-repeat;
    -webkit-background-size:100% auto;
    background-size:100% auto;
    z-index: 100;
    transform: translateX(0%);
    transition: all 0.6s;
}

.question.show {
    transform: translateX(0%);
}
.question.hide {
    transform: translateX(100%);
}
.question .title{
    margin:0 auto;
    margin-top:0.5rem;
    width:5.8rem;
    height:0.75rem;
    background: url("../images/question-title.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.question  .paper-box{
    position: relative;
    height:8rem;
}
.question .paper {
    position: absolute;
    top:0px;
    left: 0.07rem;
    padding:1.1rem 0.45rem;
    margin:0 auto;
    margin-top:0.2rem;
    height:8rem;
    width:7.37rem;
    background: url("../images/paper.png") center no-repeat;
    -webkit-background-size:100% 8rem;
    background-size:100% 100%;
    box-sizing: border-box;
}
.question .paper.paper-1{
    z-index: 12;
}


.question .paper .question-box {
    height:100%;
}
.question .paper .question-box .swiper-slide {
    height:18rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    /*height: auto;*/
}
.btn-next {
    margin:0 auto;
    margin-top:0.2rem;
    width: 3.17rem;
    height: 0.9rem;
    line-height: 0.9rem;
    background: #b60005;
    border-radius:0.2rem;
    font-size:0.36rem;
    text-align: center;
    color: #fff;
}
.btn-next:active {
    opacity: 0.8;
}
.item{
    margin-top:0.5rem;
}
.item:first-child {
    margin-top:0px;
}
.item h3{
    padding:0.05rem;
    display: block;
    width:6.45rem;
    background: #fff;
    -webkit-background-size:contain;
    background-size:contain;
    font-weight:bold;
    font-size:0.3rem;
    box-sizing: border-box;
    color: #231815;
    border:0.05rem solid #231815;
    border-radius: 0.15rem;
}
.item h3 span{
    padding-left:0.1rem;
    display: block;
    border:1px solid #231815;
    border-radius: 0.15rem;
    line-height:0.4rem;
}
.item h3 span em{
    font-weight:bold;
    font-size:0.24rem;
}
.item .number,
.item .sub,
.item .check{
    float: left;
}
.item li{
    overflow: hidden;
    position: relative;
    margin-top:0.1rem;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
}
.item li:active {
    opacity: 0.8;
}
.item li:before {
    display: table;
    content: '';
}

.item li:after {
    display: block;
    visibility: hidden;
    height: 0;
    clear: both;
    content: '.';
}
.item .number {
    padding:0.04rem;
    width:0.54rem;
    height:100%;
    background: #108ccf;
    border-radius: 0.1rem;
    box-sizing: border-box;
}
.item .number i{
    font-family: "Microsoft YaHei", serif, sans-serif;
    display: block;
    width:0.46rem;
    height:0.46rem;
    line-height:0.44rem;
    color: #fff;
    text-align: center;
    font-size:0.3rem;
    font-style: normal;
    border-radius: 100%;
    background: #0d6fb8;
}
.item .sub {
    margin-left:0.1rem;
    padding-left:0.2rem;
    width:5.77rem;
    line-height:0.54rem;
    background: #108ccf;
    box-sizing: border-box;
    color: #fff;
    font-size:0.28rem;
    border-radius: 0.1rem;
}
.item .sub .mark{
    font-family: "Microsoft YaHei", serif, sans-serif;
    color: #fff100;
    word-break:break-all;
}
.item .check{
    display: none;
    position: absolute;
    right:0.1rem;
    top:50%;
    margin-top:-0.32rem;
    width:0.69rem;
    height:0.64rem;
    background: url("../images/check.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
/*选中状态*/
.item .select .sub {
    background: #b60005;
}
.item .select .check {
    display:block;
}
.answer {
    position: absolute;
    top:0px;
    left:0px;
    width:100%;
    background: rgba(0,0,0,0.7);
    z-index: 101;
    transform: translateX(100%);
    transition: all 0.6s;
}

.answer.show {
    transform: translateX(0%);
}
.answer.hide {
    transform: translateX(100%);
}
.answer .content{
    position: relative;
    margin:0 auto;
    margin-top:0.4rem;
    width:7.13rem;
    height:9.62rem;
    background:url("../images/answer.png") center no-repeat;
    background-size:contain;
    -webkit-background-size:contain;

}
.answer .button .btn{
    float: left;
    margin-top:0.15rem;
    width: 3rem;
    height: 0.75rem;
    line-height: 0.75rem;
    background: #b60005;
    border-radius:0.2rem;
    font-size:0.36rem;
    text-align: center;
    color: #fff;

}
.answer .button .btn.btn-retry{
    margin-left:0.65rem;
}
.answer .button .btn.btn-back{
    margin-left:0.17rem;
}
.answer .scores {
    padding-top:1.4rem;
    color: #b60005;
    font-weight:bold;
    font-size:0.9rem;
    text-align: center;
}
.answer .scores span{
    font-family: Arial;
    font-size:0.8rem;
}

/*成绩*/
.answer .face{
    position: absolute;
    top:0.4rem;
    left:0.5rem;
    width:1.55rem;
    height:1.4rem;
}
.answer .word {
    text-align: center;
    color: #000000;
    font-weight:bold;
    font-size:0.4rem;
}
.answer .word .h2{
    font-size:0.5rem;
    line-height:0.7rem;
}
.answer .word .h3 {
    line-height:0.45rem;
}
.answer .content .word{
    display: none;
}

/*100分*/
.scores-100 .word-100{
    margin-top:0.5rem;
}
.scores-100 .face{
    background: url("../images/100.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.answer .content.scores-100  .word.word-100 {
    display: block;
}
/*80分*/
.scores-80 .word-80{
    margin-top:0.3rem;
}
.scores-80 .face{
    background: url("../images/80.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.answer .content.scores-80  .word.word-80 {
    display: block;
}
/*60分*/
.scores-60 .word-60{
    margin-top:0.3rem;
}
.scores-60 .face{
    background: url("../images/60.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.answer .content.scores-60  .word.word-60 {
    display: block;
}
/*0分*/
.scores-0 .word-0{
    margin-top:0.6rem;
}
.scores-0 .face{
    background: url("../images/0.png") center no-repeat;
    -webkit-background-size:contain;
    background-size:contain;
}
.answer .content.scores-0  .word.word-0{
    display: block;
}
.result-box{
    height:4.6rem;
    padding:0 0.7rem;
    margin-top:1rem;
}
.result-box .swiper-container{
    height:100%;
}
.result-box .result{
    margin-top:0.2rem;
}
.result-box .result h3{
    color: #231815;
    font-size:0.3rem;
    line-height:0.4rem;
    margin-bottom:0.1rem;
}
.result-box .result p{
    background: #b60005;
    font-size:0.28rem;
    padding:0.1rem;
    padding-left:0.26rem;
    color: #fff;
    border-radius: 0.1rem;
    word-break:break-all;
}
.result-box .result em{
    font-weight:bold;
    font-size:0.24rem;
}
.result-box .result .mark{
    font-family: "Microsoft YaHei", serif, sans-serif;
    color: #fff100;
    word-break:break-all;

}
.result-box .swiper-slide {
    height:9rem;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

@media only screen and (min-height: 500px) {
    .question .paper,
    .question .paper-box{
        height:7rem;
    }
}
@media only screen and (min-height: 550px) {
    .question .paper,
    .question .paper-box{
        height:8rem;
    }
}

@media only screen and (min-height: 600px) {
    .question .paper,
    .question .paper-box{
        height:8.5rem;
    }
}
@keyframes wave {
    from{
        transform: translate3d(0,0.05rem,0);
        opacity: 0.8;
    }
    to{
        transform: translate3d(0,0,0);
        opacity: 0;
    }
}

@keyframes wave-1 {
    from{
        opacity: 0;
        transform: scale(1);
    }
    to{
        opacity: 1;
        transform: scale(1.03);
    }
}

/*设置音乐*/
.icon_audio{
    background: url("../images/music_on.png") no-repeat;
    background-size: 100% 100%;
    width:0.55rem;
    height:0.55rem;
    position:absolute; z-index: 999; top:0.3rem; right:0.3rem;
}
.off-1{background:url("../images/music_off.png") no-repeat; background-size: 100% 100%; }
.border_anim .icon_audio_anim{
    display:block;
    width:0.1rem; height:0.16rem;
    position:absolute;
    background:url("../images/icon_audio_sign.png") no-repeat;
    background-size: 100% 100%;
    -webkit-animation:audio_anim 2s ease-out infinite;
    -moz-animation:audio_anim 2s ease-out infinite;
    -o-animation:audio_anim 2s ease-out infinite;
    opacity:0;
}
.border_anim .iconaudio1, .border_anim .iconaudio2, .border_anim .iconaudio3{ position:relative; display:block; }
.border_anim .iconaudio1{
    -webkit-transform:rotate(0deg);
    transform:rotate(0deg);
}
.border_anim .iconaudio2{
    transform:rotate(30deg);
    -webkit-transform:rotate(30deg);
}
.border_anim .iconaudio3{
    transform:rotate(45deg);
    -webkit-transform:rotate(45deg);
}
.border_anim .iconaudio2 .icon_audio_anim{
    -webkit-animation-duration:2s;
    -webkit-animation-delay:.9s;
}
.border_anim .iconaudio3 .icon_audio_anim{
    -webkit-animation-duration:2s;
    -webkit-animation-delay:1.9s;
    -moz-animation-duration:2s;
    -moz-animation-delay:.9s;
    -o-animation-duration:2s;
    -o-animation-delay:1.9s;
}
.icon_audio .audio-loading {
    background: url("../images/music-loading.gif") no-repeat;
    background-size: contain;
    width:0.55rem;
    height:0.55rem;
    position:absolute; z-index: 999; top:0; right:0;
}
@-webkit-keyframes audio_anim {
    0% { -webkit-transform:translate(0,0); transform:translate(0,0); opacity:0; }
    30% { -webkit-transform:translate(0.3rem,-0.3rem); transform:translate(0.3rem,-0.3rem); opacity:1; }
    100% { -webkit-transform:translate(0.4rem,-0.4rem); transform:translate(0.4rem,-0.4rem);  opacity:0; }
}
@keyframes audio_anim {
    0% { -webkit-transform:translate(0,0); transform:translate(0,0); opacity:0; }
    30% { -webkit-transform:translate(0.3rem,-0.3rem); transform:translate(0.3rem,-0.3rem); opacity:1; }
    100% { -webkit-transform:translate(0.4rem,-0.4rem); transform:translate(0.4rem,-0.4rem);  opacity:0; }
}



